import React, {Component} from 'react';
import _ from 'lodash';
import {observer, inject} from "mobx-react";
import styles from './index.module.less';
import ProcessContent from './processContent';
import ChatContent from './chatContent';
import CloseBar from '../../components/CloseBar';
import SideContainer from '../common/sideRender/sideContainer';
import BannerTips from '../../components/BannerTips';
import IF from '../../components/If';

// 使用groupname正则判断律师组和委托人组
function getName(name) {
    if (!name) return '';
    else if (name.match('律师')) return '【律协】';
    else if (name.match('委托人')) return '【委协】';
    else return ''
}

@inject(({chatState, commonState, userState}) => ({chatState, commonState, userState}))
@observer
class ChatDetail extends Component {
    pageChange=(e)=>{
        console.log(e);
    }
    render() {
        let commonState, chatState, userState, bannerTips;
        commonState = this.props.commonState||window[`chat_detail_${groupid}`]?.commonState;
        chatState = this.props.chatState||window[`chat_detail_${groupid}`]?.chatState
        userState = this.props.userState||window[`chat_detail_${groupid}`]?.userState
        bannerTips = this.props.bannerTips||window[`chat_detail_${groupid}`]?.bannerTips
        console.log(chatState, userState, bannerTips, "bannerTipsbannerTips")
        window.localStorage.setItem("current-active-groupid",chatState.chatId);
        const {chatId, chatContent, chatListCurrentItem, chatDraftCache, setChatDraftCache} = chatState;

        const groupid = window.sessionStorage.getItem("groupid");
        if (groupid) {
            // Ï
            window[`chat_detail_${groupid}`] = {
                commonState, chatState, userState, bannerTips
            }
        }
        const projecttype = _.get(chatListCurrentItem, 'group.projecttype');


        return (
            <div className={styles.wrapDetail}>
                <div className={styles.detail} onMouseDown={this.pageChange}>
                    <div className={styles.detailHeader}>
                        <h3>
                            {
                                chatListCurrentItem ? (
                                    chatListCurrentItem.projectid ?
                                        `${getName(chatListCurrentItem.group.groupname)} ${chatListCurrentItem.stagename}-${chatListCurrentItem.projectname}` :
                                        chatListCurrentItem.group.groupname
                                ) : null
                            }
                        </h3>
                        {commonState.sideOpen ? null : <CloseBar/>}
                    </div>
                    <BannerTips
                        show={!!bannerTips}
                        autoplay={!!(bannerTips && bannerTips.tips)}
                        type={bannerTips && bannerTips.type}
                        message={bannerTips && bannerTips.message}
                        tips={bannerTips && bannerTips.tips}
                    />
                    <IF condition={chatId}>
                        <div className={styles.detailContent}>
                            {(projecttype === 1 || projecttype === 2) ? <ProcessContent/> : null}
                            <div className={styles.chatContent}>
                                <ChatContent
                                    key={chatId}
                                    userInfo={userState.info}
                                    chatId={chatId}
                                    data={chatContent[chatId]}
                                    chatDraftCache={chatDraftCache}
                                    setChatDraftCache={setChatDraftCache}
                                    chatListCurrentItem={chatListCurrentItem}
                                />
                            </div>
                        </div>
                    </IF>
                </div>
                <SideContainer
                    key={chatId}
                    showContent={!!chatId}
                    type={1}
                    sideOpen={commonState.sideOpen}
                    activeChange={chatListCurrentItem && chatListCurrentItem.projectid ? false : true}
                    commonState={commonState}
                />
            </div>
        );
    }
}

export default ChatDetail
